<template>
	<view>
		<view class="wp">
			<view class="shu_title">
				<view class="span"></view>
				<text>留言内容（必填）</text>
			</view>
			
			<textarea  v-model="text" placeholder="请简要阐述你要反馈的内容"/>
			
			
			<view class="btn" @click="Sub()">提交</view>
			
			<!-- <view class="mass">
				<view class="span">服务热线：<text>021-54019976</text></view>
				<view class="em">
					<view>
						<image src="../../static/images/i14.png" mode="widthFix"></image>
						<text>拨打</text>
					</view>
				</view>
			</view> -->
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				text:'',
				info:[],
			}
		},
		onLoad() {
			let that = this;
			
			that.GetUserMass();

		},
		methods: {
			
			GetUserMass: function() {
				let that = this;
				uni.showLoading({
					title: '加载中...',
					mask: true
				});
				that.common.http('GET', 'user', '', function(res) {
					uni.hideLoading();
					console.log(res.data)
					that.info = res.data;
				});
			},
			
			Sub() {
				let that = this;
				if (that.text == '') {
					uni.showToast({
						icon: 'none',
						title: '请简要阐述你要反馈的内容',
						duration: 2000
					});
				}
				else{
					uni.showLoading({
						title: '提交中...',
						mask: true
					});
					let _data = {
						nickname:that.info.nickname,
						message:that.text
					}
					that.common.http('POST', 'user/message', _data, function(res) {
						uni.hideLoading();
						uni.showToast({
							icon: 'none',
							title: '提交成功！',
							duration: 2000
						});
						setTimeout(function() {
							that.navigateBack();
						}, 1500);
					});
				}				
			},
			
			navigateBack() {
				// #ifdef H5
				const pages = getCurrentPages()
				if (pages.length > 1) {
					uni.navigateBack(1)
					return;
				}
				//使用vue-router返回上一级
				let a = this.$router.go(-1)
				if (a == undefined) {}
				return;
				// #endif
				uni.navigateBack();
			},
			
		}
	}
</script>

<style scoped>
	.wp{background-color: #fff;padding: 30rpx 24rpx;}
	textarea{height: 360rpx;width: 100%;background-color: #f7f7f7;margin-top: 20rpx;
		border-radius: 5px;padding: 20rpx;box-sizing: border-box;font-size: 26rpx;
		color: #333;
	}
	
	.btn{font-size: 28rpx;color: #fff;
		height: 84rpx;display: flex;justify-content: center;align-items: center;
		width: 100%;background-color: #135cff;border-radius: 50px;
		margin-top: 60rpx;
	}
	.mass{text-align: center;margin-top: 50rpx;}
	.mass .span{display: inline-block;font-size: 26rpx;color: #666;vertical-align: middle;}
	.mass .span text{color: #135cff;}
	.mass .em{display: inline-block;margin-left: 20rpx;vertical-align: middle;
		background-color: #eaf3ff;width: 120rpx;
		border-radius: 50px;
		height: 40rpx;
		line-height: 40rpx;
	}
	.mass .em text{color: #1772f6;font-size: 24rpx;margin-left: 16rpx;}
	.mass image{width: 20rpx;vertical-align: middle;}
</style>